<template>
  <j-modal :title="title" :width="width" :visible="visible" @ok="handleOk" :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel" cancelText="关闭">
    <BasicTable @register="registerTable" :rowSelection="rowSelection" />
  </j-modal>
</template>

<script lang="ts" setup>
  import { ref, nextTick, defineExpose, unref, toRaw } from 'vue';
  import JModal from '/@/components/Modal/src/JModal/JModal.vue';
  import { BasicTree, TreeItem } from '/@/components/Tree';
  import { getDeptList } from '/@/api/demo/system';
  import { queryDepartTreeSync,queryDeptInfoById } from '/@/views/system/depart/depart.api';
  import { BasicTable, useTable, TableAction } from '/src/components/Table';
  import { columns, searchFormSchema } from '../TbContractorPersonnel.data';
  import { list } from '../TbContractorPersonnel.api';
  
  const title = ref<string>('');
  const width = ref<number>(900);
  const visible = ref<boolean>(false);
  const disableSubmit = ref<boolean>(false);
  const registerForm = ref();
  const emit = defineEmits(['register', 'success']);
  
  const checkedKeys = ref<Array<string | number>>([]);
  //注册table数据
  const [registerTable, { reload,getSelectRows,setColumns,setProps }] = useTable({
    api: list,
    rowKey: 'id',
    columns: columns,
    formConfig: {
      labelWidth: 60,
      schemas: searchFormSchema,
      baseRowStyle: { maxHeight: '20px' },
      autoSubmitOnEnter: true,
    },
    striped: true,
    useSearchForm: true,
    showTableSetting: false,
    bordered: true,
    showIndexColumn: false,
    canResize: false,
  });

  /**
   * 新增
   */
  function openConstructionManModel(ids) {
    title.value = '承包商人员清单';
    visible.value = true;
    
    console.log("-----------"+ids)
    setProps({ contractorId: ids })
    reload();
  }
  
  /**
   * 选择列配置
   */
  const rowSelection = {
    type: 'checkbox',
    columnWidth: 50,
    selectedRowKeys: checkedKeys,
    onChange: onSelectChange,
  };
  /**
   * 选择事件
   */
  function onSelectChange(selectedRowKeys: (string | number)[]) {
    checkedKeys.value = selectedRowKeys;
  }
  
  /**
   * 确定按钮点击事件
   */
  function handleOk() {
    checkedKeys.value = null;
    visible.value = false;
    emit('success', getSelectRows());
  }

  /**
   * 取消按钮回调事件
   */
  function handleCancel() {
    visible.value = false;
  }

  defineExpose({
    openConstructionManModel,
    disableSubmit,
  });
</script>

<style lang="less">
  /**隐藏样式-modal确定按钮 */
  .jee-hidden {
    display: none !important;
  }
</style>
<style lang="less" scoped></style>
